﻿body {
    background-image: linear-gradient(bottom, rgb(33,21,41) 23%, rgb(72,31,103) 43%);
    background-image: -o-linear-gradient(bottom, rgb(33,21,41) 23%, rgb(72,31,103) 43%);
    background-image: -moz-linear-gradient(bottom, rgb(33,21,41) 23%, rgb(72,31,103) 43%);
    background-image: -webkit-linear-gradient(bottom, rgb(33,21,41) 23%, rgb(72,31,103) 43%);
    background-image: -ms-linear-gradient(bottom, rgb(33,21,41) 23%, rgb(72,31,103) 43%);
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.23, rgb(33,21,41)), color-stop(0.43, rgb(72,31,103)) );
    margin: 0px 0px 0px 0px;
}

.ClearAlignment {
    clear: both;
}

.MainPage {
    min-width: 1010px;
    min-height: 768px;
    max-width: 1010px;
    max-height: 768px;
    border: 0px solid #fff;
    position: fixed;
    left: 50%;
    top: 50%;
    overflow: auto;
    margin-left: -505px;
    margin-top: -384px;
    display: none;
}

#EditCards {
    min-height: 60px;
    min-width: 650px;
    max-height: 60px;
    max-width: 650px;
    font-family: 'Segoe UI Semilight';
    font-size: 32px;
    font-weight: bold;
    color: #fff;
    vertical-align: bottom;
    background-image: linear-gradient(left, rgb(218,132,19) 10%, rgb(227,163,26) 62%);
    background-image: -o-linear-gradient(left, rgb(218,132,19) 10%, rgb(227,163,26) 62%);
    background-image: -moz-linear-gradient(left, rgb(218,132,19) 10%, rgb(227,163,26) 62%);
    background-image: -webkit-linear-gradient(left, rgb(218,132,19) 10%, rgb(227,163,26) 62%);
    background-image: -ms-linear-gradient(left, rgb(218,132,19) 10%, rgb(227,163,26) 62%);
    background-image: -webkit-gradient( linear, left top, right top, color-stop(0.1, rgb(218,132,19)), color-stop(0.62, rgb(227,163,26)) );
    border-color: #481F67;
    border-style: solid;
    float: left;
    padding-top: 120px;
}

#About {
    min-height: 60px;
    min-width: 345px;
    max-height: 60px;
    max-width: 345px;
    font-family: 'Segoe UI Semilight';
    font-size: 32px;
    font-weight: bold;
    color: #fff;
    background-image: linear-gradient(left, rgb(13,136,68) 10%, rgb(16,164,83) 62%);
    background-image: -o-linear-gradient(left, rgb(13,136,68) 10%, rgb(16,164,83) 62%);
    background-image: -moz-linear-gradient(left, rgb(13,136,68) 10%, rgb(16,164,83) 62%);
    background-image: -webkit-linear-gradient(left, rgb(13,136,68) 10%, rgb(16,164,83) 62%);
    background-image: -ms-linear-gradient(left, rgb(13,136,68) 10%, rgb(16,164,83) 62%);
    background-image: -webkit-gradient( linear, left top, right top, color-stop(0.1, rgb(13,136,68)), color-stop(0.62, rgb(16,164,83)) );
    border-color: #481F67;
    border-style: solid;
    float: left;
    padding-top: 120px;
}

#Play {
    min-height: 60px;
    min-width: 1001px;
    max-height: 60px;
    max-width: 1001px;
    font-family: 'Segoe UI Semilight';
    font-size: 32px;
    font-weight: bold;
    color: #fff;
    background-image: linear-gradient(left, rgb(64,160,167) 10%, rgb(84,191,195) 62%);
    background-image: -o-linear-gradient(left, rgb(64,160,167) 10%, rgb(84,191,195) 62%);
    background-image: -moz-linear-gradient(left, rgb(64,160,167) 10%, rgb(84,191,195) 62%);
    background-image: -webkit-linear-gradient(left, rgb(64,160,167) 10%, rgb(84,191,195) 62%);
    background-image: -ms-linear-gradient(left, rgb(64,160,167) 10%, rgb(84,191,195) 62%);
    background-image: -webkit-gradient( linear, left top, right top, color-stop(0.1, rgb(64,160,167)), color-stop(0.62, rgb(84,191,195)) );
    border-color: #481F67;
    border-style: solid;
    padding-top: 300px;
}

.PageDescription {
    font-family: 'Segoe UI Semilight';
    font-size: 24px;
    color: #fff;
    padding-bottom: 50px;
}

.PageTitle {
    font-family: 'Segoe UI';
    font-size: 48px;
    color: #fff;
    font-weight: bold;
    padding-bottom: 3px;
}

.Label {
    padding-left: 30px;
}

.ButtonsContainer {
    text-align: right;
    padding-top: 10px;
}

.QuestionDiv {
    width: 300px;
    float: left;
}

.AnswerDiv {
    width:  300px;
        float: left;
}

.TextInputBox {
    width: 200px;
}

.SettingsContent {
    overflow: auto;
    height:  500px;
}

#GameBoard {
    height:  480px;
    background-color: white;
    color: #000;
    padding: 20px 20px 20px 20px;
    font-size: 36px;
}

.Content {
    /*Might need more stuff in the future*/
}

@media screen and (-ms-view-state: fullscreen-landscape) {
}

@media screen and (-ms-view-state: filled) {
}

@media screen and (-ms-view-state: snapped) {
}

@media screen and (-ms-view-state: fullscreen-portrait) {
}